<?php

use wap\assets\PageAsset;
use yii\helpers\Url;
use yii\widgets\ActiveForm;

/* @var $this yii\web\View */
/* @var $data \home\models\Cart[] */

$this->title = '购物车';
$this->params['breadcrumbs'][] = $this->title;
$this->params['backUrl'] = Url::to(['site/index']);

PageAsset::register($this)->init([
    'css' => [
        'css/cart.css',
    ],
]);
?>

    <div class="page-body">
        <div class="cart-list clearfix">
            <div class="container">

                <?php ActiveForm::begin([
                    'id' => 'cart-form',
                    'action' => Url::to(['cart/confirm'])
                ]); ?>
                <table class="table table-responsive">
                    <thead>
                        <tr>
                            <td width="15%"><input id="multi-checkbox-top" class="multi-checkbox" type="checkbox" /> &nbsp; <label for="multi-checkbox-top" style="font-weight: normal">全选</label></td>
                            <td width="20%">款式</td>
                            <td width="35%">规格</td>
                            <td width="20%">数量</td>
                            <td width="10%">操作</td>
                        </tr>
                    </thead>
                    <tbody>
                    <?php if($data){ ?>
                        <?php foreach($data as $datum){ ?>
                            <tr>
                                <td>
                                    <input type="checkbox" name="ids[]" value="<?= $datum->id ?>" /> &nbsp;
                                    <img src="<?= $datum->product->getPreviewUrl(100, 100) ?>" />
                                </td>
                                <td class="cart-product-name"><?= $datum->product->name . $datum->product->category->name ?></td>
                                <td class="cart-product-attr"><?= $datum->showAttrs() ?></td>
                                <td class="cart-product-quantity">
                                    <div class="quantity">
                                        <a class="quantity-button quantity-minus" href="javascript:;"><span class="iconfont icon-minus"></span></a>
                                        <div id="quantity" class="quantity-input" contenteditable="true"><?= $datum->quantity ?></div>
                                        <a class="quantity-button quantity-plus" href="javascript:;"><span class="iconfont icon-plus"></span></a>
                                    </div>
                                </td>
                                <td><a href="<?= Url::to(['cart/remove', 'id[]' => $datum->id]) ?>">删除</a></td>
                            </tr>
                        <?php } ?>
                    <?php }else{ ?>
                        <td colspan="5" class="text-center" style="padding: 30px">购物车是空的！</td>
                    <?php } ?>
                    </tbody>
                    <tfoot>
                    <tr>
                        <td colspan="2">
                            <input id="multi-checkbox-bottom" class="multi-checkbox" type="checkbox" /> &nbsp;
                            <label for="multi-checkbox-bottom" style="font-weight: normal">全选</label> &nbsp; &nbsp;
                            <a id="remove-all" href="javascript:;">删除选中商品</a>
                        </td>
                        <td></td>
                        <td colspan="2" class="text-right">
                            已选中商品 <span class="quantity-total">0</span> 件 &nbsp; &nbsp;
                            <a id="to-checkout" href="javascript:;" class="to-checkout">去下意向单 >></a>
                        </td>
                    </tr>
                    </tfoot>
                </table>
                <?php ActiveForm::end(); ?>
            </div>
        </div>
    </div>

<?php

$removeUrl = Url::to(['cart/remove']);
$updateUrl = Url::to(['cart/update']);

$js = <<<JS

var updateTotal = function(){
    var total = 0;
    
    $('div.quantity-input').each(function(index, obj){
        total += parseInt($(obj).text());
    });
    
    $('span.quantity-total').text(total);
};

$('.quantity-button').click(function(){
    var id = $(this).closest('tr').find('[name="ids[]"]').val();
    var plus = $(this).hasClass('quantity-plus');
    var quantity = parseInt($(this).parent().find('.quantity-input').text());
    
    if(plus){
        quantity++;
    }else{
        quantity--;
    }
    
    if(quantity <= 0){
        quantity = 1;
    }
    
    $(this).parent().find('.quantity-input').text(quantity);
    
    $.post('$updateUrl', {id: id, quantity: quantity});
});

$('.multi-checkbox').change(function(){
    $('[name="ids[]"]').prop('checked', $(this).prop('checked'));
    $('.multi-checkbox').prop('checked', $(this).prop('checked'));
    updateTotal();
});

$('[name="ids[]"]').click(function(){
    updateTotal();
});

$('#remove-all').click(function(){
    $.post('$removeUrl', $('#cart-form').serialize(), function(data){
        if(data.msg){
            alert(data.msg);
        }
        
        if(data.error == 0){
            window.location.reload();
        }
    }, 'json');
});

$('#to-checkout').click(function(){
    if($('[name="ids[]"]:checked').length < 1){
        alert('请选择商品！');
        return;
    }
    
    $('#cart-form').submit();
});

JS;

$this->registerJs($js);
